import { forwardRef, useRef, useImperativeHandle } from 'react'
import { createStyles, useStyles } from '@mf2e/react-native-theme-styles'
import mnb from '@mf2e/mnb'
import ViewShot from 'react-native-view-shot'

const BaseShareCard = forwardRef(({ style, children }, ref) => {
  const styles = useStyles(themeStyles)

  const rootRef = useRef()

  useImperativeHandle(ref, () => {
    return {
      share: async () => {
        mnb('share.showShareCardLoading', { showIMChat: true })
        const data = await rootRef.current.capture()
        mnb('share.shareCard', {
          mode: 'imageData',
          data: data,
          shareText: '分享图片',
          shortUrl: ' ',
          showIMChat: true,
        })
      },
    }
  })

  return (
    <ViewShot style={[styles.BaseShareCard, style]} ref={rootRef} options={{ result: 'data-uri' }}>
      {children}
    </ViewShot>
  )
})

const themeStyles = createStyles({
  BaseShareCard: {
    position: 'absolute',
    top: 10000,
  },
})

export default BaseShareCard
